<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>列表展示</title>
    <link rel="stylesheet" href="./layui/css/layui.css" media="all">
    <style>
        body {
            margin: 10px;
        }

        .demo-carousel {
            height: 200px;
            line-height: 200px;
            text-align: center;
        }
    </style>

</head>

<body>
<script src="./layui/layui.all.js"></script>
<script src="./layui/jquery.min.js"></script>
<div id="demo3">您已经成功支付订单</div>
<table id="demo" lay-filter="test"></table>

<script>
    layui.use('table', function () {

        var table = layui.table;
        //第一个实例
        table.render({
            elem: '#demo'
            ,height: 312
            ,url: '/order/list?orderState=1' //数据接口
            ,page: false //开启分页
            ,cols: [[ //表头
                {field: 'id', title: 'ID', width:180, sort: true, fixed: 'left'}
                ,{field: 'totalFee', title: '价格', width:180, templet:function (data) {
                        var price = parseFloat(data.totalFee).toFixed(2); //设置小数点后个数
                        return price;
                 }}
                ,{field: 'orderState', title: '状态', width:180, templet:function (data) {
                    var orderState = data.orderState == '1' ? '支付成功':'支付失败' ; //设置小数点后个数
                    return orderState;
                }}
            ]]
            ,parseData: function(res){ //res 即为原始返回的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.total, //解析数据长度
                    "data": res.data.records //解析数据列表
                };
            }
        });
    });
</script>
</body>
</html>
